<template>
  <div class="hd history">
  
    <search-bar :menu="menu" :showsearch="false" :activeitem="activeitem"></search-bar>
    <position style="padding:12px;width:auto;">
      <router-link to="/cloud">云诊室</router-link>
      &gt;
      <router-link to="/cloud/my_file">我的档案</router-link>
      &gt;
      <span class="last">云诊室病历</span>
    </position>
    <div class="papercontainer">
      <div class="paperbox">
        <p>
          <span class="papertitle">云诊室病历</span>
        </p>
        <div class="paperimg">
          <div class="cbox">
            <ul class="clisthalf">
              <li>
                <span class="label">姓&nbsp;&nbsp;&nbsp;名：</span>
                <span class="content">测试</span>
              </li>
              <li>
                <span class="label">性&nbsp;&nbsp;&nbsp;别：</span>
                <span class="content">{{person.sex | sex}}</span>
              </li>
              <li>
                <span class="label">年&nbsp;&nbsp;&nbsp;龄：</span>
                <span class="content">{{age}}岁</span>
              </li>
              <li>
                <span class="label">门诊号：</span>
                <span class="content">{{patientId}}</span>
              </li>
              <li>
                <span class="label">科&nbsp;&nbsp;&nbsp;室：</span>
                <span class="content">{{urlinfo.regDeptName}}</span>
              </li>
              <li>
                <span class="label">日&nbsp;&nbsp;&nbsp;期：</span>
                <span class="content">{{urlinfo.workDate}}</span>
              </li>
            </ul>
          </div>

          <div class="cbox">
            <ul class="clist">
              <li>
                <span class="lablelarge">主&nbsp;&nbsp;&nbsp;诉：</span>
                <span class="content" v-if="main[0]">{{main[0].split(':')[1]}}</span>
              </li>
              <li>
                <span class="lablelarge">病&nbsp;&nbsp;&nbsp;史：</span>
                <span class="content" v-if="main[1]">{{main[1].split(':')[1]}}</span>
              </li>
              <li>
                <span class="lablelarge">体格检查：</span>
                <span class="content" v-if="main[2]">{{main[2].split(':')[1]}}</span>
              </li>
              <li>
                <span class="lablelarge">实验室检查：</span>
                <span class="content" v-if="main[3]">{{main[3].split(':')[1]}}</span>
              </li>
              <li>
                <span class="lablelarge">医&nbsp;&nbsp;&nbsp;嘱：</span>
                <span class="content" v-if="main[4]">{{main[4].split(':')[1]}}</span>
              </li>
              <li>
                <span class="lablelarge">日&nbsp;&nbsp;&nbsp;期：</span>
                <span class="content">{{medicdate.slice(0,16)}}</span>
              </li>
            </ul>
          </div>

          <div class="cbox">
            <p>诊断</p>
            <ul class="clist">
              <li v-for="(value,index) in medicjudge">
                {{value}}
              </li>
            </ul>
          </div>

          <div class="cbox">
            <p>处理</p>
            <ul>
              <!--<li v-for="(value,index) in examlabList" class="sub">-->
                <!--<p class="subcontent">{{value.titleInfo}}</p>-->
              <!--</li>-->
              <li class="sub">
                <p v-for="(value,index) in examlabList" class="subcontent">{{value.titleInfo}}</p>
                <p v-for="(value,index) in drugList" class="subcontent">{{index+1}}. &nbsp;{{value.drugName}}&nbsp;*{{value.count}}&nbsp;{{value.countUnit}} &nbsp;{{value.frequencyDisplay}}&nbsp; {{value.days}} &nbsp;{{value.route}}</p>
              </li>
            </ul>
          </div>
        </div>
      </div>
    </div>
  </div>
</template>

<script>
  import SearchBar from '../../components/SearchBar'
  import Position from '../../components/Position'
  import {CLOUD_MENU, commonAjax, PLATFORM_PREFIX} from '../../api/api'
  export default {
    components: {SearchBar, Position},
    data () {
      return {
        menu: CLOUD_MENU,
        activeitem: 4,
        person: JSON.parse(localStorage.person),
        patientId: localStorage.patientId,
        urlinfo: this.$route.query,
        main: [],
        medicdate: '',
        medicjudge: [],
        examlabList: [],
        drugList: []
      }
    },
    filters: {
      'sex' (val) {
        if (val === '1') {
          return '男'
        } else {
          return '女'
        }
      }
    },
    computed: {
      'age' () {
        let born = this.person.dob.slice(0, 4)
        let year = new Date().getFullYear()
        return year - born
      }
    },
    mounted () {
      this.getdetail()
      this.getdoornum()
    },
    methods: {
      getdetail () {
        let param = [{
          'dicd': '',
          'mpiId': '',
          'clinicNo': this.urlinfo.regPwd,
//          'clinicNo': 40254990,
          'localOrgId': '0ab18621-cc00-4c4a-9b35-4ff28a7d9bcc',
          'orgName': '江苏省中医院'
        }]
        commonAjax(param, `${PLATFORM_PREFIX}.dhccService`, 'getDhccOutDetail').then(res => {
          if (res.data.code === 200) {
            if (res.data.body.medicalRecordList) {
              if (res.data.body.medicalRecordList[0].outmedicalRecordContent) {
                this.main = res.data.body.medicalRecordList[0].outmedicalRecordContent.split('^')
              }
              if (res.data.body.medicalRecordList[0].medicalRecordCreateDate) {
                this.medicdate = res.data.body.medicalRecordList[0].medicalRecordCreateDate
              }
              if (res.data.body.medicalRecordList[0].diagnoseContent) {
                this.medicjudge = res.data.body.medicalRecordList[0].diagnoseContent.split('^')
              }
            }
            if (res.data.body.examlabList) {
              this.examlabList = res.data.body.examlabList
            }
            if (res.data.body.drugList) {
              this.drugList = res.data.body.drugList
            }
          } else {
            this.$message({
              message: res.data.msg,
              type: 'error'
            })
          }
        }).catch(res => {
          this.$message({
            message: '请求服务器失败',
            type: 'error'
          })
        })
      },
      getdoornum () {
        commonAjax([this.person.mpiId], `${PLATFORM_PREFIX}.patientArchivesService`, 'getPatientCardNo').then(res => {
          if (res.data.code === 200) {
            localStorage.patientId = res.data.body.patientId
          } else {
            this.$message({
              message: res.data.msg,
              type: 'error'
            })
          }
        }).catch(res => {
          this.$message({
            message: '请求服务器失败',
            type: 'error'
          })
        })
      }
    }
  }
</script>

<style scoped>
  .paperbox{
    border:1px solid #efefef;
    background-color: white;
  }
  .papertitle{
    border-right:1px solid #383838;
    padding-right:10px;
  }
  .papercontainer{
    background-color: white;
    padding:0 20px 20px 20px;
  }
  .paperbox>p{
    border-bottom:1px solid #efefef;
    padding:10px;
  }
  .paperimg{
    background-color: #FFFBF8;
    padding-top:10px;
  }
  .bg{
    background-color: #FFFBF8;
  }
  .cbox{
    padding:10px;
    border:1px solid #e8e8e8;
    margin:0 10px 10px 10px;
    background-color: white;
  }
  .clisthalf{
    display:flex;
    flex-wrap: wrap;
  }
  .clisthalf>li{
    display:flex;
    width:50%;
    padding:3px 0;
  }
  .clist>li{
    display:flex;
    padding:3px 0;
  }
  .label{
    width:70px;
    color:#666;
  }
  .lablelarge{
    width:100px;
    color:#666;
  }
  .content{
    flex:1 1;
    color:#333;
  }
  .boxtitle{
    margin:0;
    padding-bottom:10px;
  }
  .pagetitle{
    padding-left:10px;
  }
  .subcontent{
    padding:10px;
  }
</style>
